<script setup lang="ts">
import ActionBar from "./Layout/ActionBar.vue";
</script>

<template>
  <div class="scaffold">
    <ActionBar />
    <div class="spliter" />
    <div class="view-container">
      <router-view style="flex: 1" />
    </div>
  </div>
</template>
<style lang="scss" scoped>
.scaffold {
  padding: 10px;
  display: flex;
  flex-direction: row;
  height: 100%;
  width: 100%;
  background-color: var(--el-bg-color-page);

  .spliter {
    width: 10px;
  }

  .view-container {
    flex: 1;
    display: flex;
    background-color: var(--el-bg-color);
    border-radius: 8px;
    padding: 10px;
  }
}
</style>
